/**
 * Created by GUO on 2017/5/20.
 * @flow
 */

import React from 'react';
import {
    FlatList,
    Text,
    View,
    StyleSheet,
    PixelRatio,
    TouchableOpacity,
    Image,
} from 'react-native';


export default class PostItem extends React.PureComponent{

    props: {
        onPress: ?()=>void,
        post: Object,
        style?: StyleSheet
    }

    render(){

        let {title,feed_title,img,time} = this.props.post;

        return (
            <TouchableOpacity
                onPress={this.props.onPress}
                activeOpacity={0.5}
                style = {[styles.item,this.props.style]}>
                <View style = {styles.itemLeftContainer}>
                    <Text style = {styles.itemTitle} numberOfLines={2}>
                        {title}
                    </Text>
                    <Text style={styles.itemAuthor} numberOfLines={1}>
                        {`${feed_title}  ${time}`}
                    </Text>
                </View>
                <Image
                    style = {styles.pic}
                    defaultSource={require('../assets/pic_default.png')}
                    source={{uri:img}}/>
            </TouchableOpacity>
        );
    }
}

export const ITEM_HEIGHT = 84;
const ITEM_PIC_HEIGHT = 58;
const styles = StyleSheet.create({
    item:{
        height:ITEM_HEIGHT,
        backgroundColor:'white',
        flexDirection: 'row',
        justifyContent:'flex-start',
        alignItems:'center',
        padding:8,
        marginHorizontal:8,
        marginBottom:4,
    },
    itemLeftContainer:{
        flex:1,
        justifyContent: 'space-between',
        height:ITEM_PIC_HEIGHT
    },
    itemTitle:{
        fontSize:16,
        color:'black',
    },
    itemAuthor:{
        fontSize:12,
        color:'rgba(0,0,0,0.54)',
    },
    pic:{
        width:92,
        height:ITEM_PIC_HEIGHT,
        marginLeft:8,
    }
});